<!--
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->
<div class="panel panel-default mainpage">
  <div class="panel-body">
    <h1>Welcome to Apache Ambari</h1>
    <div ng-if="isLoaded" id="main-operations-boxes" class="row thumbnails">
      <p ng-hide="cluster">Provision a cluster, manage who can access the cluster, and customize views for Ambari users.</p>
      <p ng-show="cluster">Monitor your cluster resources, manage who can access the cluster, and customize views for Ambari users.</p>

        <!--Clusters-->
      <div ng-show="cluster" class="col-sm-11 thumbnail">
        <h4 class="title">Operate Your Cluster</h4>
        <div class="description">Manage the configuration of your cluster and monitor the health of your services</div>
        <div class="glyphicon glyphicon-cloud"></div>
        <div class="buttons">
        <span ng-class="{active: isActive('clusters.manageAccess')}">
          <a ng-show="cluster.Clusters.provisioning_state != 'INSTALLED'" href class="btn btn-primary permission-button" ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">Manage Permissions</a>
          <a ng-show="cluster.Clusters.provisioning_state == 'INSTALLED'" href="#/clusters/{{cluster.Clusters.cluster_name}}/manageAccess" class="btn btn-primary permission-button" ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">Manage Permissions</a>
        </span>
        <span>
          <a ng-show="cluster.Clusters.provisioning_state != 'INSTALLED'" href class="btn btn-primary go-dashboard-button" ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">Go to Dashboard</a>
          <a ng-show="cluster.Clusters.provisioning_state == 'INSTALLED'" href="/#/main/dashboard/metrics" class="btn btn-primary go-dashboard-button" ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">Go to Dashboard</a>
        </span>
        </div>
      </div>
      <div ng-hide="cluster" class="col-sm-11 thumbnail">
        <h4 class="title">Create a Cluster</h4>
        <div class="description">Use the Install Wizard to select services and configure your cluster</div>
        <div class="glyphicon glyphicon-cloud"></div>
        <div class="buttons"> <a href="/#/installer/step0" class="btn btn-primary create-cluster-button">Launch Install Wizard</a></div>
      </div>

        <!--Manage Users and groups-->
      <div class="col-sm-5 thumbnail">
        <h4 class="title">Manage Users + Groups</h4>
        <div class="description">Manage the users and groups that can access Ambari</div>
        <div class="glyphicon glyphicon-user"></div>
        <div class="buttons">
          <span ng-class="{active: isActive('users.list')}"><link-to route="users.list" class="btn btn-primary userslist-button">Users</link-to></span>
          <span ng-class="{active: isActive('groups.list')}"><link-to route="groups.list" class="btn btn-primary groupslist-button">Groups</link-to></span>
        </div>
      </div>

        <!--Deploy Views-->
      <div class="col-sm-5 thumbnail">
        <h4 class="title">Deploy Views</h4>
        <div class="description">Create view instances and grant permissions</div>
        <div class="glyphicon glyphicon-th"></div>
        <div ng-class="{active: isActive('views.list')}" class="buttons"><link-to route="views.list" class="btn btn-primary viewslist-button">Views</link-to></div>
        </div>
      </div>
  </div>
</div>
